<!DOCTYPE html>
<html>
<head>
  <meta content="IE=11.0000" http-equiv="X-Ua-Compatible">
  <meta charset="utf-8">
  <meta name="renderer" content="webkit">

  <meta http-equiv="X-Ua-Compatible" content="IE=edge,chrome=1">
  <title>选择业务类型</title>
  <link href="../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
  <script src="../assets/plugins/jquery/jquery.min.js"></script>

  <link href="../assets/module/gcjsy/css/public.css" rel="stylesheet">
  <link rel="stylesheet" href="../登录注册/chooes.css">
</head>

<body style="background: #f5f5f5">



<div class="choose-h">

  <ul class="choose-box2">
    <li class="active">
      <i class="textIco"></i>
      <div class="chooseText">
        <h4>变更申请 </h4>
        <p>备案时间到期前需办理延期信息登记</p>
      </div>
    </li>
    <li class="no-margin">
      <i class="textIco"></i>
      <div class="chooseText">
        <h4>延续申请 </h4>
        <p>可延续计划竣工日期，延期以两次为限，每次不超过三个</p>
      </div>
    </li>
  </ul>

  <div class="text-center padding-bottom-40 padding-top-10">
    <button type="button" class="basicsBtn blue" href="javascript:;" >确定</button>
  </div>
</div>


  <script>
    $('.choose-box2').children('li').on('click',function () {
      var index = $(this).index();
      $(this).addClass('active').siblings().removeClass('active');

    });
  </script>
</body>
</html>
